<template>
    <a-spin :spinning="spinning != 0">
        <a-table
          ref="table"
          size="small"
          bordered
          rowKey="id"
          :columns="columns"
          :dataSource="dataSource"
          :pagination="pagination"
          :rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
          @change="handleTableChange"
          :customRow="clickThenCheck"
        >
          <template slot="serialNum" slot-scope="text,record,index">
            {{(pagination.current-1) * pagination.pageSize + parseInt(index) + 1}}
          </template>
        </a-table>
    </a-spin>
</template>

<script>

  import YchConstant from "@/api/YchConstant";
  import {ViewMixin} from '@/mixins/ViewMixin'

  export default {
    name: "BpmHandoverTaskList",
    mixins: [ViewMixin],
    props: {
      userId: {
        type: String,
        required: true
      }
    },
    data() {
      return {
        visible: false,
        spinning: 0,//遮罩
        // 表头
        columns: [
          {
            title:this.$t('m.common.label.number'),
            dataIndex: '',
            key: 'rowIndex',
            width: '50px',
            align: 'center',
            scopedSlots: { customRender: 'serialNum' },
          },
          {
            title: this.$t('m.bpm.entity.taskTitle'),
            align: 'left',
            dataIndex: 'taskTitle',
            ellipsis: true,
          },
          {
            title: this.$t('m.bpm.entity.processDefName'),
            align: 'left',
            width: '150px',
            dataIndex: 'processDefName',
            ellipsis: true,
          },
          {
            title: this.$t('m.bpm.entity.taskName'),
            align: 'left',
            width: '120px',
            dataIndex: 'taskName',
            ellipsis: true,
          },
          {
            title: this.$t('m.bpm.entity.taskType'),
            align: 'center',
            dataIndex: 'identityString',
            width: '60px'
          },
          {
            title: this.$t('m.bpm.entity.fromUserName'),
            align: 'center',
            dataIndex: 'fromUserName',
            width: '150px',
            customRender: function (t, r, index) {
              return t + (r.fromDeptName ? '/' + r.fromDeptName : '')
            }
          },
          {
            title: this.$t('m.bpm.entity.sendTimeString'),
            align: 'center',
            dataIndex: 'sendTimeString',
            width: '130px'
          }
        ],
        url: {
          list: YchConstant.PREFIX_BPM + '/bpm-back/processInstanceRest/queryTodoAndToReadByPage/v1?assignee='+this.UserId,
        }
      }
    },
    methods: {
    },
    computed: {
      theUserId () {
        return this.userId
      },

    },
    watch: {
      theUserId: {
        immediate: true,
        handler(val) {
          if(val){
            this.url.list = YchConstant.PREFIX_BPM + '/bpm-back/processInstanceRest/queryTodoAndToReadByPage/v1?assignee='+val
            this.loadData(1)
          }else{
            this.dataSource = []
          }

        }
      }
    },
  }
</script>
<style lang="less" scoped>
  /deep/ .ant-modal-body {
    padding: 5px 24px 5px 24px !important;
  }
</style>
